<template>
    <a-card id="screenshot-test" hoverable style="height:100%; overflow:auto">
        <a-row>
            <a-col>
                <a-button size="small" @click="shot" :disabled="is_get_screenshot">载图</a-button>&nbsp;
                <a-button size="small" @click="screenVideo">视频</a-button>&nbsp;
                <!-- <span v-show="is_get_screenshot">正在截图</span> -->
            </a-col>
        </a-row>
        <a-row>
            <a-col>
                <img class="my-img" ref="my_img"></img>
            </a-col>
        </a-row>
        <a-row>
            <a-col>
                <video class="my-video" ref="my_video"></video>
            </a-col>
        </a-row>
    </a-card>
</template>

<script lang="ts" src="./Screenshot.vue.ts" />

<style lang="less">
#screenshot-test {
    .my-video {
        width: 100%;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        margin-top: 8px;
    }
    .my-img {
        width: 100%;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        margin-top: 8px;
    }
}
</style>
